$(document).ready(function () {
    var postTitleSelector = ".postTitle";
    var selectedPostSelector = "#selectedPost";
    var recentPostBodySelector = "#recentPostBody";
    var backButtonSelector = "#backButton";
    var postCommentSelector = "#postComment";
    var authorComment = "#authorComment";
    var addPostSelector = "#addPost";

    var numberOfPosts = 2;
    var numberOfSymbols = 360;
    function InitialLoad() {
        var urlPath = document.location.protocol + "//" + document.location.host + "/MiniBlog.svc/Posts/" + numberOfPosts + "/" + numberOfSymbols;

        $.ajax({
            url: urlPath,
            type: "GET",
            dataType: 'json',
            async: false,
            success: function (data) {
                if (data != null) {
                    var content = "";
                    $.each(data, function (key, post) {
                        $.each(post, function (key, b) {
                            //                            console.log(b);
                        });

                        //                        console.log(post.PostId);

                        content += '<div class="post">';
                        content += '<div class="Title">';
                        content += '<div class="postTitle" id="postId_' + post.PostId + '">' + post.Title + '</div>';
                        content += '<div class="leftFloat postDate">' + post.Date + '</div>';
                        var commentCountText = "";
                        if (post.CommentsCount == 0) {
                            commentCountText = "No";
                        }
                        else {
                            commentCountText = post.CommentsCount;
                        }
                        content += '<div class="rightFloat recentPostBodyComments">' + commentCountText + ' comments</div>';
                        content += '<div class="clearFloat"></div>';
                        content += '</div>';
                        content += '<div class="postBody">' + post.Body;
                        if (post.Body.length == 360) {
                            content += ' ... <span class="readMore">(read more)</span>';
                        }
                        content += '</div>';
                        content += '</div>';
                        content += '<div class="postDelimiter"></div>';
                        content += '<div class="clearFloat"></div>';
                    });

                    $(recentPostBodySelector).html('');
                    $(recentPostBodySelector).prepend(content);

                    $(postTitleSelector).bind('click', function () {
                        showSelectedPost(this)
                    });

                    $(backButtonSelector).bind('click', function () {
                        hideSelectedPost(this)
                    });
                }
                else {
                    alert("error");
                }
            },
            error: function (xhr, ajaxOptions, thrownError) {
                //                        alert(xhr.status);
                //                        alert(thrownError);
            }
        });
    }

    InitialLoad();

    function showSelectedPost(obj) {
        $(recentPostBodySelector).hide();
        $(selectedPostSelector).show();
        $(backButtonSelector).show();

        var postId = $(obj).attr("id").substring(7);
        console.log(postId);
    }

    function hideSelectedPost() {
        $(recentPostBodySelector).show();
        $(selectedPostSelector).hide();
        $(backButtonSelector).hide();
    }

    function PostNewComment() {
        var commentPost = new Object();
        commentPost.PostId = 2;
        commentPost.Author = GetCommentAuthor();
        commentPost.Body = GetCommentBody();

        var dataToSend = '{"commentPost":' + JSON.stringify(commentPost) + '}';
        var urlPath = document.location.protocol + "//" + document.location.host + "/MiniBlog.svc/PostComment";

        $.ajax({
            url: urlPath,
            type: "Post",
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            async: false,
            data: dataToSend,
            success: function (response) {

            },
            error: function (xhr, ajaxOptions, thrownError) {
                //                        alert(xhr.status);
                //                        alert(thrownError);
            }
        });
    }

    function GetCommentAuthor() {
        var author = $(authorComment).val();
        return author;
    }

    function GetCommentBody() {
        var body = $(postCommentSelector).val();
        return body;
    }

    $(addPostSelector).click(function () {
        PostNewComment();
        $(authorComment).val('');
        $(postCommentSelector).val('');
    });

});